/*
 * @Author: sbotlp
 * @Email: sbotlp@sina.com
 * @Date: 2019-06-29 17:43:08
 * @LastEditTime: 2019-06-30 10:30:18
 * @Description: http://www.sbotlp.com.cn
 */
import * as React from 'react';
import { Button } from 'antd';
import { connect } from 'src/app/redux/connect/Connect';
import { Route, Switch, Redirect, Link } from 'react-router-dom';
import { Loading } from 'src/app/views/component/loading/Loading';
import { RouterPath } from './path';
interface Props extends React.Props<any> {
  Loading?: any
}
@connect(state => state)
export class App extends React.Component<Props, any> {
  constructor(props: any) {
    super(props)
    this.state = {
      hasError: false
    }
    this.routerPathFunc();
  }
  public routerList: any = [];
  errComponent() {
    return (
      <div>
        <h1>404</h1>
        <Link to='/'>
          <Button>回到主页</Button>
        </Link>
      </div>
    )
  }
  componentDidCatch = () => {
    this.setState({
      hasError: true
    })
  }
  routerPathFunc = () => {
    RouterPath.forEach(v => {
      if (v.children && v.children.length) {
        v.children.forEach(item => {
          this.routerList.push({
            ...item,
            path: `${v.parentPath ? v.parentPath : ''}${item.path}`
          })
        })
      }
    })
    console.log('this.routerList', this.routerList);
  }
  render() {
    const { hasError } = this.state
    return hasError ? (
      <h1>致命错误</h1>
    ) : (
      <div className='app'>
        <Switch>
          {
            this.routerList.map((v, k) => (
              <Route key={k} path={v.path} component={v.component} exact={v.exact} />
            ))
          }
          <Route path='/404' component={this.errComponent} />
          <Redirect to='/404' />
        </Switch>
        <Loading/>
      </div>
    )
  }
}